{extend name="base" /}
{block name="css"}
{css href="__CSS__/coupon.css" /}
{/block}
{block name="body"}
<!-- 主要内容 开始 -->
<div class="weui-tab__bd-item">
    <header class="weui-navBar weui-navBar-fixed">
        <a href="javascript:history.go(-1);" class="weui-navBar-item">
            <i class="icon iconfont icon-fanhui"></i>
        </a>
        <div class="weui-center">
            <span class="weui-center-title">我的优惠券</span>
        </div>
        <a href="javascript:;" class="weui-navBar-item actionsheet">
            <i class="icon iconfont icon-gengduo"></i>
        </a>
    </header>
    <div class="weui-tab">
      <div class="weui-navbar">
        <a class="weui-navbar__item weui-bar__item--on" href="#tab1">未使用</a>
        <a class="weui-navbar__item" href="#tab2">已使用</a>
        <a class="weui-navbar__item" href="#tab3">已过期</a>
      </div>
      <div class="weui-tab__bd">
        <div id="tab1" class="weui-tab__bd-item weui-tab__bd-item--active">
        	{volist name="data" id="v" empty="$empty"}
            {if $v.usage eq 1}
            <div class="aui-coupon-box">
              	<div class="aui-coupon-list">
    	            <div class="aui-coupon-list-flex">
    	                <div class="aui-coupon-list-flex-hd">
    	                    <h2> <i>￥</i> {$v.price}</h2>
    	                    <p>{if $v.condition gt 0}满￥{$v.condition}可用{else}无金额门槛{/if}</p>
    	                </div>
    	                <div class="aui-coupon-list-flex-bd">
    	                    <h3>  <em>{if $v.type eq 1}现金{elseif $v.type eq 2}运费{elseif $v.type eq 3}积分{else}其他{/if}</em> {$v.name}优惠券 </h3>
                            <span class="aui-flex-box">{if $v.source eq 1}新人专享{elseif $v.source eq 2}签到{elseif $v.source eq 3}购买商品{elseif $v.source eq 4}邀请新人{else}其他{/if}</span>
                            {if $v.cat_range}
                            <span class="aui-received"></span>
                            <button class="aui-vou-btn-der">去使用</button>
                            {else}
                            <button class="aui-vou-btn-der aui-vou-btn-der-one">立即领取</button>
                            {/if}
                            <p>{$v.end_time|date="Y.m.d"}<i>剩2天</i></p>
    	                </div>
    	            </div>
    	            <div class="aui-show-content">
    	                <a href="javascript:;" class="aui-coupon-list-flex-bt btn-slide" id="btn-slide">LAS手表旗舰店全场商品通用 <i class="icon icon-dow"></i> </a>
    	                <div class="aui-show" id="" style="display:none">
    	                    <p>以下商家商品适用</p>
    	                    <p>商家店铺的名称：嘻哈杂货铺</p>
    	                    <p>自营店铺或者其他的店铺 请资讯店内的客服 或者店铺客服 </p>
    	                </div>
    	            </div>
            	</div>
            </div>
            {/if}
        	{/volist}
        </div>
        <div id="tab2" class="weui-tab__bd-item">
          	<div class="tab-item tab-item-two">
                {volist name="data" id="v" empty="$empty"}
                {if $v.usage eq 2}
                <div class="aui-coupon-box">
                    <div class="aui-coupon-list">
                        <div class="aui-coupon-list-flex">
                            <div class="aui-coupon-list-flex-hd">
                                <h2> <i>￥</i> {$v.price}</h2>
	                    		<p>{if $v.condition gt 0}满￥{$v.condition}可用{else}无金额门槛{/if}</p>
                            </div>
                            <div class="aui-coupon-list-flex-bd">
                                <h3>  <em>{if $v.type eq 1}现金{elseif $v.type eq 2}运费{elseif $v.type eq 3}积分{else}其他{/if}</em> {$v.name}优惠券 </h3>
                                <span class="aui-flex-box">{if $v.source eq 1}新人专享{elseif $v.source eq 2}签到{elseif $v.source eq 3}购买商品{elseif $v.source eq 4}邀请新人{else}其他{/if}</span>
	                    		<p>{$v.end_time|date="Y.m.d"} 已使用</p>
                            </div>
                        </div>
                        <div class="aui-show-content">
                            <a href="javascript:;" class="aui-coupon-list-flex-bt btn-slide">LAS手表旗舰店全场商品通用 <i class="icon icon-dow"></i> </a>
                            <div class="aui-show" id="" style="display:none">
                                <p>以下商家商品适用</p>
                                <p>商家店铺的名称：嘻哈杂货铺</p>
                                <p>自营店铺或者其他的店铺 请资讯店内的客服 或者店铺客服 </p>
                            </div>
                        </div>
                    </div>
                </div>
                {/if}
                {/volist}
            </div>
        </div>
        <div id="tab3" class="weui-tab__bd-item">
          <div class="tab-item tab-item-two">
          		{volist name="data" id="v" empty="$empty"}
                {if $v.usage eq 3}
                <div class="aui-coupon-box">
                    <div class="aui-coupon-list">
                        <div class="aui-coupon-list-flex">
                            <div class="aui-coupon-list-flex-hd">
                                <h2> <i>￥</i> {$v.price}</h2>
	                    		<p>{if $v.condition gt 0}满￥{$v.condition}可用{else}无金额门槛{/if}</p>
                            </div>
                            <div class="aui-coupon-list-flex-bd">
                                <h3>  <em>{if $v.type eq 1}现金{elseif $v.type eq 2}运费{elseif $v.type eq 3}积分{else}其他{/if}</em> {$v.name}优惠券 </h3>
                                <span class="aui-flex-box">{if $v.source eq 1}新人专享{elseif $v.source eq 2}签到{elseif $v.source eq 3}购买商品{elseif $v.source eq 4}邀请新人{else}其他{/if}</span>
	                    		<p>{$v.end_time|date="Y.m.d"} 已过期</p>
                            </div>
                        </div>
                        <div class="aui-show-content">
                            <a href="javascript:;" class="aui-coupon-list-flex-bt btn-slide">LAS手表旗舰店全场商品通用 <i class="icon icon-dow"></i> </a>
                            <div class="aui-show" id="" style="display:none">
                                <p>以下商家商品适用</p>
                                <p>商家店铺的名称：嘻哈杂货铺</p>
                                <p>自营店铺或者其他的店铺 请资讯店内的客服 或者店铺客服 </p>
                            </div>
                        </div>
                    </div>
                </div>
                {/if}
                {/volist}
            </div>
        </div>
      </div>
    </div>
</div>
<!-- 主要内容 结束 -->
{/block}
{block name="js"}
<script type="text/javascript">
  $(function () {
    $('.btn-slide').click(function(){
        // 修改优惠券规则
        $(this).siblings().attr("style")=='display:none' ? $(this).siblings().attr("style","display:block;"):$(this).siblings().attr("style","display:none");
    });
  });
</script>
{/block}